<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>坯料计算</title>

	<style>
		*{
			margin: 0;

			padding: 0;
		}

		table{
			font-size: 35px;
			margin:0 auto;
			padding: 0;
			margin-top: 50px
		}
		input{
			 width: 85%; 
			 font-size: 35px;
			 
			 text-align: center;
			 height:85px;
			 margin-left: 25px;
			 

		}
		td{
			text-align: center;
		}
		#content{
			
			
			margin: 0 auto;
			margin-top: 30px;
			font-size: 35px;
			height: 200px;

		}
		ul{
			width: 100%;

			margin:0 auto;
			

		}
		ul li{
			float: left;
			list-style: none;
			margin: 50px auto;
			width: 50%;
			text-align: center;
			color: red;
			
		}

		#first li{
			
		}
		button{
			width: 30%;
			font-size: 35px;

		}
		#jisuan{
			margin-top: 100px;
			text-align: center;
		}

		

	</style>
</head>
<body>
	<table border="2px" cellspacing="0" width="80%">
		<tr>
			<th style="height: 85px">冲模中径平均值，算冲孔后长起的高度</th>
		</tr>
		<tr>
			<td><span style="color: red">冲头</span><input placeholder="冲头大小" type="number" name="chongtou" id="chongtou" value="0"></td>
		</tr>
		<tr>
			<td><span style="color: red">中径</span><input placeholder="冲模中径" type="number" name="zhongjing" id="zhongjing"></td>
		</tr>

		<tr>
			<td><span style="color: red">下料</span><input placeholder="下料重量" type="number" name="xm" id="xm"></td>
		</tr>


	</table>

	<div id="content">
		<ul id="first">
			<li id="0">坯料预计长的高度：</li>
			
		</ul>
		

	</div>
	<div id="jisuan">

		<button onclick="jisuan()">计算</button>	

	</div>

	<script>

		function jisuan(){

		var  chongtouName="chongtou",zhongjingName="zhongjing",xmName="xm"

		var  message={
			chongtou:getInput(chongtouName).valueAsNumber,
			zhongjing:getInput(zhongjingName).valueAsNumber,
			xm:getInput(xmName).valueAsNumber
			
		}

		
		var height=(message.xm/((message.zhongjing*message.zhongjing-message.chongtou*message.chongtou)*0.00617*0.001*1.04)).toFixed(2);


		getInput("first").children[0].innerText="坯料预计长的高度："+height;
		


	}
		
/*获取input元素*/

		function getInput(id){
			var obj = document.getElementById(id);

			return obj;
		}


	</script>
</body>
</html>